<template>
    <div>
        <Form :model="formItem" inline>
            <FormItem>
                <Input v-model="formItem.company" placeholder="单位"></Input>
            </FormItem>
            <FormItem>
                <Input v-model="formItem.count_num" placeholder="加油次数"></Input>
            </FormItem>
            <FormItem>
                <Select v-model="formItem.one_card" style="width: 200px" placeholder="是否一车一卡">
                    <Option value="0">是</Option>
                    <Option value="1">否</Option>
                </Select>
            </FormItem>
            <FormItem>
                <Button type="success" @click="search()">搜索</Button>
            </FormItem>
            <FormItem>
                <Button type="primary" @click="exportData"><Icon type="ios-download-outline"></Icon>导出</Button>
            </FormItem>
            <FormItem>
                <Button type="info" @click="back()">返回</Button>
            </FormItem>
        </Form>
        <Table border :columns="columns12" :data="data6" ref="table" :loading="loading">
            <template slot-scope="{ row }" slot="count_num">
                <strong>{{ row.count_num }}</strong>
            </template>
        </Table>
        <Modal v-model="modal2" width="760">
            <p slot="header" style="color:#f60;text-align:center">
                <!--                <Icon type="ios-information-circle"></Icon>-->
                <span>核查</span>
            </p>
            <div style="text-align:center">
                <Row>
                    <Col span="2" style="margin-top: 5px">
                        检查情况
                    </Col>
                    <Col span="15">
                        <Input v-model="value"/>
                    </Col>
                </Row>
                <Row style="margin-top: 20px">
                    <Col span="2">
                        结果
                    </Col>
                    <Col span="15">
                        <Input v-model="value7" type="textarea"  />
                    </Col>
                </Row>
            </div>
            <div slot="footer" style="display: inline;margin-right: 10px">
                <Button type="error" size="large" @click="aa">立案处理</Button>
            </div>
            <div slot="footer" style="display: inline">
                <Button type="info" size="large" @click="aa">误报信息</Button>
            </div>
        </Modal>
    </div>
</template>

<script>
import { getExportSpvTransactionsBynumList } from '@/api/user'
export default {
  data () {
    return {
      loading: true,
      formItem: {
        count_num: '',
        company: '',
        one_card: ''
      },
      modal2: false,
      value7: '',
      value: '',
      value2: ['2016-01-01', '2016-02-15'],
      columns12: [
        {
          title: '交易流水号',
          key: 'batch_number',
          align: 'center'
        },
        {
          title: '是否一车一卡',
          key: 'one_card',
          align: 'center'
        },
        // {
        //   title: '金额',
        //   key: 'money',
        //   align: 'center'
        // },
        {
          title: '多次加油的次数',
          key: 'count_num',
          slot: 'count_num',
          align: 'center'
        },
        {
          title: '交易类型',
          key: 'transaction_type',
          align: 'center'
        },
        {
          title: '交易状态',
          key: 'transaction_status',
          align: 'center'
        },
        {
          title: '卡号/客户编号',
          key: 'card_num',
          align: 'center'
        },
        {
          title: '客户名称',
          key: 'name',
          align: 'center'
        },
        {
          title: '商品种类',
          key: 'type',
          align: 'center'
        },
        {
          title: '油量',
          key: 'fuel',
          align: 'center'
        },
        {
          title: '受理机构',
          key: 'acceptance_organization',
          align: 'center'
        },
        // {
        //   title: '业务日期',
        //   key: 'business_time',
        //   align: 'center'
        // },
        {
          title: '首次交易时间',
          key: 'transaction_time',
          align: 'center'
        },
        // {
        //   title: '石油公司名称',
        //   key: 'oil_company_name',
        //   align: 'center'
        // },
        {
          title: '单位',
          key: 'company',
          align: 'center'
        },
        {
          title: '石油公司',
          key: 'oil_companies',
          align: 'center'
        },
        {
          title: '问题类型',
          key: 'problem',
          align: 'center'
        }
        // {
        //   title: '操作',
        //   slot: 'action',
        //   width: 150,
        //   align: 'center'
        // }
      ],
      data6: [],
      total: 0
    }
  },
  methods: {
    async init (data) {
      getExportSpvTransactionsBynumList(data).then(ret => {
        this.data6 = ret.data.data
        this.data6.forEach(item => {
          let a = new Date(item.business_date)
          let y = a.getFullYear()
          let m = a.getMonth() + 1
          let d = a.getDate()
          if (m < 10) {
            m = '0' + m
          }
          if (d < 10) {
            d = '0' + d
          }
          item.business_date = y + '-' + m + '-' + d
          item.problem = '一日多次加油'
        })
        this.loading = false
        console.log(this.total)
      })
    },
    aa () {
      this.modal2 = false
    },
    show () {
      this.modal2 = true
    },
    search () {
      const data = {
        // count_num: this.formItem.count_num,
        // company: this.formItem.company,
        one_card: this.formItem.one_card
      }
      this.init(data)
    },
    exportData () {
      for (let i = 0; i < this.data6.length; i++) {
        if (this.data6[i].batch_number) {
          this.data6[i].batch_number = '\t' + this.data6[i].batch_number
        }
        if (this.data6[i].card_num) {
          this.data6[i].card_num = '\t' + this.data6[i].card_num
        }
      }
      this.$refs.table.exportCsv({
        filename: '导出文件',
        columns: this.columns12,
        data: this.data6
      })
    },
    back () {
      this.$router.push({
        name: 'refueling-three'
      })
    }
  },
  mounted () {
    this.init()
  }
}
</script>

<style scoped>
    .ivu-table .demo-table-info-cell-name {
        background-color: #2db7f5;
        color: #fff;
    }
</style>
